<template>
  <el-dialog title="配置" :visible.sync="dialogVisible" width="40%" @close="onClose()" v-draggable>
    <div>
      <span class="my_span">选择设备</span>
      <el-select v-model="value" placeholder="请选择" class="ml-3 mr-4" @change="getList()" :disabled="value != '' && activeName != 1">
        <el-option v-for="item in options" :key="item.deviceCode" :label="item.deviceName" :value="item.deviceCode"> </el-option>
      </el-select>
      <span class="my_span">参数名称</span>
      <el-input v-model="input" placeholder="参数名称模糊查询" @input="getList()" class="ml-3"></el-input>
    </div>
    <el-tabs v-model="activeName" type="card" @tab-click="handleClick" v-if="type == 0" class="mt-3">
      <el-tab-pane label="区域一" name="1"> </el-tab-pane>
      <el-tab-pane label="区域二" name="2"> </el-tab-pane>
      <el-tab-pane label="区域三" name="3"> </el-tab-pane>
      <el-tab-pane label="区域四" name="4"> </el-tab-pane>
      <el-tab-pane label="区域五" name="5"> </el-tab-pane>
    </el-tabs>
    <el-table :data="tableData" border :class="type == 0 ? '' : 'my_table'" height="40vh" ref="multipleTable" @selection-change="handleSelectionChange">
      <el-table-column prop="parameterName" label="参数名称" align="center"> </el-table-column>
      <el-table-column prop="parameterCode" label="参数代码" align="center"> </el-table-column>
      <el-table-column prop="parameterValue" label="参数值" align="center"> </el-table-column>
      <el-table-column prop="parameterValueName" label="参数值名称" align="center"> </el-table-column>
      <el-table-column type="selection" width="70" align="center"> </el-table-column>
    </el-table>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="onSave">保 存</el-button>
      <el-button @click="onClose()">取 消</el-button>
    </span>
  </el-dialog>
</template>
<script>
import { queryMyDeviceList, queryRealTimeDataPullDown, addOrUpdateProjectOverviewTwo, addOrUpdateProjectOverviewOne } from '@/api/projectOverview/index'
export default {
  data() {
    return {
      value: '',
      input: '',
      activeName: '1',
      options: [],
      tableData: [],
      multipleSelection: [],
      dialogVisible: false,
      type: null, //0是系统运行信息，1是图表
      voltage: [],
      current: [],
      power: [],
      powerTotal: [],
      chargeTotal: [],
      selectData: [],
      setNum: null, //当前配置的第二排序号
      data1: {
        deviceCode: 'DEVC09011696082',
        list: {
          voltage: [
            {
              id: null,
              createBy: null,
              createByName: null,
              createTime: '2023-09-13 11:18:34',
              updateBy: null,
              updateByName: null,
              updateTime: null,
              pageIndex: 0,
              pageSize: 0,
              messages: null,
              isDeleted: null,
              mapString1: null,
              mapString2: null,
              startTime: null,
              endTime: null,
              deviceCode: 'DEVC09011696082',
              batchNo: 'BATC09134454346',
              parameterCode: 'IA',
              parameterName: 'A相电流',
              parameterValue: '0.0',
              parameterValueName: '0.0A',
              subType: null
            }
          ],
          current: [
            {
              id: null,
              createBy: null,
              createByName: null,
              createTime: '2023-09-13 11:18:34',
              updateBy: null,
              updateByName: null,
              updateTime: null,
              pageIndex: 0,
              pageSize: 0,
              messages: null,
              isDeleted: null,
              mapString1: null,
              mapString2: null,
              startTime: null,
              endTime: null,
              deviceCode: 'DEVC09011696082',
              batchNo: 'BATC09134454346',
              parameterCode: 'IB',
              parameterName: 'B相电流',
              parameterValue: '0.0',
              parameterValueName: '0.0A',
              subType: null
            }
          ],
          power: [
            {
              id: null,
              createBy: null,
              createByName: null,
              createTime: '2023-09-13 11:18:34',
              updateBy: null,
              updateByName: null,
              updateTime: null,
              pageIndex: 0,
              pageSize: 0,
              messages: null,
              isDeleted: null,
              mapString1: null,
              mapString2: null,
              startTime: null,
              endTime: null,
              deviceCode: 'DEVC09011696082',
              batchNo: 'BATC09134454346',
              parameterCode: 'IC',
              parameterName: 'C相电流',
              parameterValue: '0.0',
              parameterValueName: '0.0A',
              subType: null
            }
          ],
          powerTotal: [
            {
              id: null,
              createBy: null,
              createByName: null,
              createTime: '2023-09-13 11:18:34',
              updateBy: null,
              updateByName: null,
              updateTime: null,
              pageIndex: 0,
              pageSize: 0,
              messages: null,
              isDeleted: null,
              mapString1: null,
              mapString2: null,
              startTime: null,
              endTime: null,
              deviceCode: 'DEVC09011696082',
              batchNo: 'BATC09134454346',
              parameterCode: 'PA',
              parameterName: 'A相功率',
              parameterValue: '0.0',
              parameterValueName: '0.0W',
              subType: null
            }
          ],
          chargeTotal: [
            {
              id: null,
              createBy: null,
              createByName: null,
              createTime: '2023-09-13 11:18:34',
              updateBy: null,
              updateByName: null,
              updateTime: null,
              pageIndex: 0,
              pageSize: 0,
              messages: null,
              isDeleted: null,
              mapString1: null,
              mapString2: null,
              startTime: null,
              endTime: null,
              deviceCode: 'DEVC09011696082',
              batchNo: 'BATC09134454346',
              parameterCode: 'UA',
              parameterName: 'A相电压',
              parameterValue: '228.0',
              parameterValueName: '228.0V',
              subType: null
            }
          ]
        }
      },
      data2: {
        deviceCodeOne: 'DEVC09011696082',
        list: [
          {
            id: null,
            createBy: null,
            createByName: null,
            createTime: '2023-09-13 11:18:34',
            updateBy: null,
            updateByName: null,
            updateTime: null,
            pageIndex: 0,
            pageSize: 0,
            messages: null,
            isDeleted: null,
            mapString1: null,
            mapString2: null,
            startTime: null,
            endTime: null,
            deviceCode: 'DEVC09011696082',
            batchNo: 'BATC09134454346',
            parameterCode: 'IA',
            parameterName: 'A相电流',
            parameterValue: '0.0',
            parameterValueName: '0.0A',
            subType: null
          },
          {
            id: null,
            createBy: null,
            createByName: null,
            createTime: '2023-09-13 11:18:34',
            updateBy: null,
            updateByName: null,
            updateTime: null,
            pageIndex: 0,
            pageSize: 0,
            messages: null,
            isDeleted: null,
            mapString1: null,
            mapString2: null,
            startTime: null,
            endTime: null,
            deviceCode: 'DEVC09011696082',
            batchNo: 'BATC09134454346',
            parameterCode: 'IB',
            parameterName: 'B相电流',
            parameterValue: '0.0',
            parameterValueName: '0.0A',
            subType: null
          }
        ]
      }
    }
  },
  mounted() {},
  methods: {
    getOptions() {
      queryMyDeviceList().then((res) => {
        this.options = res.object
      })
    },
    getList(type, data) {
      queryRealTimeDataPullDown({
        deviceCode: this.value,
        messages: this.input
      }).then((res) => {
        this.tableData = res.object
        if (type == 1) {
          this.handleClick()
        } else {
          this.toggleSelection(data)
        }
      })
    },
    onSave() {
      if (this.type == 1) {
        if (this.multipleSelection.length == 0) return this.$message.error('请选择数据！')
        let deviceCode = this.setNum == 1 ? 'deviceCodeOne' : this.setNum == 2 ? 'deviceCodeTwo' : 'deviceCodeThree'
        let deviceName = this.setNum == 1 ? 'deviceNameOne' : this.setNum == 2 ? 'deviceNameTwo' : 'deviceNameThree'
        let parameterCode = this.setNum == 1 ? 'parameterCodeOne' : this.setNum == 2 ? 'parameterCodeTwo' : 'parameterCodeThree'
        let obj = {}
        let url = ''
        this.multipleSelection.map((item, index) => {
          if (index == 0) {
            url += item
          } else {
            url += '&' + item
          }
        })
        obj[deviceCode] = this.value
        obj[deviceName] = this.options.filter((item) => item.deviceCode == this.value)[0].deviceName
        obj[parameterCode] = url
        addOrUpdateProjectOverviewTwo(obj).then((res) => {
          this.$message({
            message: res.message,
            type: 'success'
          })
          this.onClose()
        })
      } else {
        if (this.voltage.length == 0 && this.current.length == 0 && this.power.length == 0 && this.powerTotal.length == 0 && this.chargeTotal.length == 0)
          return this.$message.error('请选择数据！')
        let arr = [
          { name: 'voltage', url: '' },
          { name: 'current', url: '' },
          { name: 'power', url: '' },
          { name: 'powerTotal', url: '' },
          { name: 'chargeTotal', url: '' }
        ]
        arr.forEach((item) => {
          console.log(this[item.name])
          this[item.name]
            .map((iten) => iten.parameterCode)
            .map((val, index) => {
              if (index == 0) {
                item.url += val
              } else {
                item.url += '&' + val
              }
            })
        })
        let obj = {
          deviceCode: this.value,
          deviceName: this.options.find((item) => item.deviceCode == this.value).deviceName,
          voltage: arr.find((item) => item.name == 'voltage').url,
          current: arr.find((item) => item.name == 'current').url,
          power: arr.find((item) => item.name == 'power').url,
          powerTotal: arr.find((item) => item.name == 'powerTotal').url,
          chargeTotal: arr.find((item) => item.name == 'chargeTotal').url
        }
        addOrUpdateProjectOverviewOne(obj).then((res) => {
          this.$message({
            message: res.message,
            type: 'success'
          })
          this.onClose()
        })
      }
    },
    handleSelectionChange(val) {
      if (this.type == 1) {
        this.multipleSelection = val.map((item) => item.parameterCode)
      } else {
        switch (this.activeName) {
          case '1':
            this.voltage = val
            break
          case '2':
            this.current = val
            break
          case '3':
            this.power = val
            break
          case '4':
            this.powerTotal = val
            break
          case '5':
            this.chargeTotal = val
            break
          default:
            break
        }
      }
    },
    handleClick() {
      let data =
        this.activeName == '1'
          ? this.voltage
          : this.activeName == '2'
          ? this.current
          : this.activeName == '3'
          ? this.power
          : this.activeName == '4'
          ? this.powerTotal
          : this.chargeTotal
      this.toggleSelection(data)
    },
    toggleSelection(data) {
      this.$refs.multipleTable.clearSelection()
      if (data.length != 0) {
        data.forEach((row) => {
          this.$nextTick(() => {
            this.$refs.multipleTable.toggleRowSelection(
              this.tableData.find((item) => {
                return row.parameterCode == item.parameterCode
              }),
              true
            )
          })
        })
      }
    },
    onClose() {
      this.value = ''
      this.activeName = '1'
      this.options = []
      this.tableData = []
      this.multipleSelection = []
      this.dialogVisible = false
    }
  }
}
</script>
<style scoped lang="scss">
.el-input {
  width: 220px !important;
}

::v-deep .el-dialog {
  border-radius: 8px;

  .el-dialog__footer {
    text-align: center !important;
  }
}

::v-deep .el-dialog__header {
  border-radius: 8px 8px 0 0;
  background-color: #e6e6e6;
}

.ml-3 {
  margin-left: 12px;
}

.my_span {
  font-size: 16px;
}

.my_table {
  margin-top: 16px;
}

.dialog-foote {
  text-align: center;
}

// ::v-deep .el-table {

//     tr th {
//         background-color: #e6e6e6;
//         border-right: none;
//     }
// }
</style>
